<template>
	<view>
		<u-popup
			v-model="show"
			mode="center"
			mask-close-able
			border-radius="32"
			close-icon-size="36"
		>
			<view class="popup-container">
				<view class="title">充值活动通知</view>
				<view class="content u-f-ajc">
					<text>
						尊敬的各位用户，感谢您对本次充值优惠活动的支持。根据业务调整，自<text style="color: red;">	2021年5月1日</text>起，停止充值优惠活动，后续优惠活动敬请期待！
					</text>
				</view>
				<view class="btn" @tap="know">知道了</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
			show: false
		};
	},
	mounted() {
		setTimeout(() => {
			this.canTap = true;
		}, 1500);
	},
	methods: {
		know() {
			this.show = false;
			// uni.setStorageSync('chargeNotice', true);
		},
		open() {
			// let chargeNotice = uni.getStorageSync('chargeNotice') || false;
			// if (chargeNotice) return;
			this.show = true;
		},
		close() {
			if (this.canTap) {
				this.show = false;
			}
		}
	}
};
</script>

<style lang="scss">
.popup-container {
	width: 550rpx;
	height: 650rpx;
	background-color: #ffffff;
	display: flex;
	flex-direction: column;
	align-items: center;

	.title {
		padding: 20rpx 0;
		font-weight: 800;
		color: #333;
		font-size: 40rpx;
	}

	.content {
		flex-direction: column;
		align-items: center;
		flex: 1;
		padding: 30rpx;
		font-size: 34rpx;
		line-height: 2;
		text-indent: 2em;
	}
	.btn {
		background-color: #2eba6a;
		color: #ffffff;
		margin: 24rpx 0;
		padding: 16rpx 40rpx;
		border-radius: 16rpx;
	}
}
</style>
